<template>
  <view class="box">
    <view class="title">技术支持</view>
    <view class="titleText"
      >数据安全保驾护航，我们将持续做好安全、稳定、可靠的平台业务技术支持；无行业竞争！</view
    >
    <view class="list" v-for="(item, ind) in list" :key="ind">
      <view class="right">
        <view class="itemTitle">{{ item.title }}</view>
        <rich-text class="itemText" :nodes="item.text"></rich-text>
      </view>
    </view>
    <view class="img">
      <u-image
        :src="cover"
        width="180rpx"
        height="180rpx"
        class="goods-card__img"
      ></u-image>
    </view>
    <view class="codeBox"><text class="code">扫码添加专属客服</text></view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      list: [
        {
          title: '对内数据',
          text: '保密协议<br>数据库在云服务器上，个人不保留数据信息<br>使用数据需通过多方授权'
        },
        {
          title: '业务上',
          text: '钱不过系统，降低业务安全风险<br>通过手机短信预充值减少各类手续费'
        },
        {
          title: '对外数据',
          text: '数字证书保证不被破解和盗取使用<br>使用云服务器'
        },
        {
          title: '个性化定制',
          text: '根据客户业务发展的需求进行个性化的数据服务<br>根据产品特性进行一些统计和展示<br>帮助代理/商户解决统计和核算问题'
        }
      ]
    }
  },
  components: {},
  computed: {},

  onLoad(options) {},
  onShareAppMessage(res) {},
  methods: {}
}
</script>
<style lang="scss" scoped>
.box {
  padding: 30rpx;
  .title {
    text-align: center;
    font-size: 30rpx;
  }
  .title::after {
    content: '-';
    color: #969696;
    position: relative;
    left: 12rpx;
  }
  .title:before {
    content: '-';
    color: #969696;
    position: relative;
    right: 12rpx;
  }
  .titleText {
    text-align: center;
    font-size: 24rpx;
    margin: 14rpx 40rpx 0 40rpx;
    color: #666666;
  }
  .list {
    display: flex;
    margin-top: 30rpx;
    background: #fff;
    border-radius: 24rpx;
    padding: 30rpx;
    .left {
      margin-right: 16rpx;
      width: 88rpx;
      height: 88rpx;
      .panel-section-item__icon-img {
        display: block;
        width: 88rpx;
        height: 88rpx;
      }
    }
    .right {
      flex: 1;
      .itemTitle {
        font-size: 28rpx;
        font-weight: 500;
        color: #333333;
      }
      .itemTitle::before {
        display: inline-block;
        position: relative;
        content: ' ';
        width: 12rpx;
        height: 12rpx;
        border-radius: 50%;
        background: #fe6507;
        right: 12rpx;
        top: -5rpx;
      }
      .itemText {
        font-size: 24rpx;
        color: #666666;
      }
    }
  }
  .img {
    border-top: 1rpx dotted #969696;
    padding-top: 30rpx;
    margin-top: 40rpx;
    .goods-card__img {
      display: block;
      width: 180rpx;
      height: 180rpx;
      margin: 0 auto;
      border: 1rpx solid #fe6507;
    }
  }
  .codeBox {
    text-align: center;
    margin: 0 auto;
    .code {
      padding: 3rpx 12rpx;
      background: #fe6507;
      font-size: 24rpx;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #ffffff;
      line-height: 33px;
      margin: 0 auto;
    }
  }
}
</style>
